﻿@model RegisterModel
@using Nop.Web.Models.Customer;
@{
    Layout = "~/Views/Shared/_Root.cshtml";

    //title
    Html.AddTitleParts(T("PageTitle.Register").Text);
}
@if (Model.CountryEnabled && Model.StateProvinceEnabled)
{
    <script type="text/javascript">
     $(function() {
            $("#@Html.FieldIdFor(model => model.CountryId)").change(function() {
                var selectedItem = $(this).val();
                var ddlStates = $("#@Html.FieldIdFor(model => model.StateProvinceId)");
                var statesProgress = $("#states-loading-progress");
                statesProgress.show();
                $.ajax({
                    cache: false,
                    type: "GET",
                    url: "@(Url.RouteUrl("GetStatesByCountryId"))",
                    data: { "countryId": selectedItem, "addEmptyStateIfRequired": "true" },
                    success: function (data) {
                        ddlStates.html('');
                        $.each(data, function(id, option) {
                            ddlStates.append($('<option></option>').val(option.id).html(option.name));
                        });
                        statesProgress.hide();
                    },
                    error:function (xhr, ajaxOptions, thrownError){
                        alert('Failed to retrieve states.');
                        statesProgress.hide();
                    }  
                });
            });
        });
    </script>
}
@using (Html.BeginForm())
{
    @Html.AntiForgeryToken()
    <div class="page registration-page">

        <div class="page-body">
            <div class="message-error">
                @Html.ValidationSummary(true)
            </div>

            @Html.Partial("_ExternalAuthentication.AssociateMessage")

            <div class="register-block">
                <div class="register-input-fields">
            <h2>SpotsHUB @T("Account.Register")</h2>
            @if (Model.GenderEnabled)
            {
                    <label>@T("Account.Fields.Gender"):</label>

                    @Html.RadioButton("Gender", "M", (Model.Gender == "M"), new { id = "gender-male" })
                    <label class="forcheckbox" for="gender-male">@T("Account.Fields.Gender.Male")</label>
                    @Html.RadioButton("Gender", "F", (Model.Gender == "F"), new { id = "gender-female" })
                    <label class="forcheckbox" for="gender-female">@T("Account.Fields.Gender.Female")</label>
            }
            <div class="register-input-name">
                <div class="register-input-firstname">
                @Html.LabelFor(model => model.FirstName)<br />

                @Html.EditorFor(model => model.FirstName)
                @Html.ValidationMessageFor(model => model.FirstName)
                </div>
                <div class="register-input-lastname">
                @Html.LabelFor(model => model.LastName)<br />
                @Html.EditorFor(model => model.LastName)
                @Html.ValidationMessageFor(model => model.LastName)
                </div>

                <div class="content-clear"></div>
            </div>
            
            @if (Model.DateOfBirthEnabled)
            {

                    <label>@T("Account.Fields.DateOfBirth")</label>
                    @Html.DatePickerDropDowns(Html.FieldNameFor(x => x.DateOfBirthDay),
                        Html.FieldNameFor(x => x.DateOfBirthMonth),
                        Html.FieldNameFor(x => x.DateOfBirthYear),
                        DateTime.Now.Year - 110,
                        DateTime.Now.Year,
                        Model.DateOfBirthDay,
                        Model.DateOfBirthMonth,
                        Model.DateOfBirthYear)
                    @Html.ValidationMessageFor(model => model.DateOfBirthDay)
                    @Html.ValidationMessageFor(model => model.DateOfBirthMonth)
                    @Html.ValidationMessageFor(model => model.DateOfBirthYear)

            }
            <div class="register-input-email">
            @Html.LabelFor(model => model.Email) <br />
            @Html.EditorFor(model => model.Email)
            @Html.ValidationMessageFor(model => model.Email)
            </div>
            @if (Model.UsernamesEnabled)
            {
                    @Html.LabelFor(model => model.Username)
                    @Html.EditorFor(model => model.Username)
                    @Html.RequiredHint()
                    @Html.ValidationMessageFor(model => model.Username)
                if (Model.CheckUsernameAvailabilityEnabled)
                {
                        @Html.Partial("_CheckUsernameAvailability")
                }

            }
            <div class="register-input-password">
            @Html.LabelFor(model => model.Password)<br />
            @Html.EditorFor(model => model.Password)
            @Html.ValidationMessageFor(model => model.Password)
            </div>
            <div class="register-input-passwordconfirm">
            @Html.LabelFor(model => model.ConfirmPassword)<br />
            @Html.EditorFor(model => model.ConfirmPassword)
            @Html.ValidationMessageFor(model => model.ConfirmPassword)
            </div>
            @if (Model.DisplayCaptcha)
            {
                    @Html.Raw(Html.GenerateCaptcha())

            }
            
            </div>

            <div class="buttons">
                <div class="externalauthentication">
                    @Html.Action("ExternalMethods", "ExternalAuthentication")
                </div>
                <input type="submit" class="button-red register-next-step-button" value="@T("Account.Register.Button")" name="register-button" />
            </div>
            <div class="content-clear"></div>

            </div>
           
            <div class="login-block">
                <div>Already have an account? Click here to sign in!</div>
                <input type="button" class="register-button button-grey" onclick="location.href='@Url.RouteUrl("Login")'" value="@T("Account.Login")" />
            </div>
            <div class="business-block">
                <h3>Business Invoice Account Sign Up</h3>
                <p>Semi-monthly detailed invoice billing for business users</p>
                <input type="button" class="button-grey application-form" onclick="location.href='/Content/files/SpotsHUBExpressApplication.pdf'" value="Download Application">

            </div>
        </div>
        <div class="content-clear"></div>
        <div style="border-top: 1px solid #ccc;padding-top: 15px;margin-top: 15px;">By registering with SpotsHUB, I agree to the following:
            <ul> 
                <li>I have read and accept the <a style="text-decoration:underline;" href="/terms-and-conditions"><strong>Terms and Conditions</strong></a> and <a style="text-decoration:underline;" href="/privacy-policy"><strong>Privacy Policy</strong></a></li>
                <li>I have reached the age of majority in the province in which I reside</li>
                <li>I understand that the information I provide will be collected, processed and stored by SpotsHUB, located in Burnaby, British Columbia, Canada</li>
                <li>I provide my express consent to receive electronic communications from SpotsHUB (including its employees and affiliates) and I understand that I can withdraw my consent at any time by sending an email to info@spotshub.com</li>
            </ul>
        </div>
    </div>
}